<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="Access-Control-Allow-Origin" content="*" />
    <link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />
    <!--==================== UNICONS 图标====================-->
    <link
      rel="stylesheet"
      href="https://unicons.iconscout.com/release/v3.0.6/css/line.css"
    />
    <!--==================== SWIPER CSS ====================-->
    <link rel="stylesheet" href="assets/css/swiper-bundle.min.css" />

    <!--==================== CSS ====================-->
    <link rel="stylesheet" href="assets/css/styles.css" />
    <!-- iconfont font class 方式引用图标 -->
    <script src="https://at.alicdn.com/t/c/font_4028933_vz12bxz615.js"></script>
    <!-- <link
      rel="stylesheet"
      href="https://at.alicdn.com/t/c/font_3900458_82z46p85im.css"
    /> -->

    <title>个人在线简历</title>
  </head>
  <body>
    <!--==================== HEADER ====================-->
    <header class="header scroll-header" id="header">
      <nav class="nav container">
        <a href="#" class="nav__logo">LanAn</a>

        <div class="nav__menu" id="nav-menu">
          <ul class="nav__list grid">
            <li class="nav__item">
              <a href="#home" class="nav__link">
                <i class="uil uil-estate nav__icon"></i>
                <p i18n="home">主页</p>
              </a>
            </li>
            <li class="nav__item">
              <a href="#about" class="nav__link">
                <i class="uil uil-user nav__icon"></i>
                <p i18n="about">关于</p>
              </a>
            </li>
            <li class="nav__item">
              <a href="#skills" class="nav__link">
                <i class="uil uil-file-alt nav__icon"></i>
                <p i18n="skills">技能</p>
              </a>
            </li>
            <li class="nav__item">
              <a href="#portfolio" class="nav__link">
                <i class="uil uil-scenery nav__icon"></i>
                <p i18n="portfolio">项目集</p>
              </a>
            </li>
            <li class="nav__item">
              <a href="#contact" class="nav__link">
                <i class="uil uil-message nav__icon"></i>
                <p i18n="contact">联系方式</p>
              </a>
            </li>
            <li class="nav__item">
              <div class="nav__link" id="translate" value="cn">
                <svg class="icon nav__icon-svg" aria-hidden="true">
                  <use xlink:href="#icon-fanyi"></use>
                </svg>
                <a class="=nav__link" id="nav__translate">Translate</a>
              </div>
            </li>
          </ul>
          <i class="uil uil-times nav__close" id="nav-close"></i>
        </div>

        <div class="nav__btns">
          <i class="uil uil-moon change-theme" id="theme-button"></i>
          <div class="nav__toggle" id="nav-toggle">
            <i class="uil uil-apps"></i>
          </div>
        </div>
      </nav>
    </header>

    <!--==================== MAIN ====================-->
    <main class="main">
      <!--==================== HOME ====================-->
      <section class="home section" id="home">
        <div class="home__container container grid">
          <div class="home__content grid">
            <div class="home__social">
              <a
                href="https://gitee.com/mao_jin_zhi"
                target="_blank"
                class="home__social-icon"
              >
                <!-- <i class="uil uil-linkedin-alt"></i> -->
                <svg
                  t="1674798484640"
                  viewBox="0 0 1024 1024"
                  version="1.1"
                  xmlns="http://www.w3.org/2000/svg"
                  p-id="2757"
                >
                  <path
                    d="M512 1024C229.222 1024 0 794.778 0 512S229.222 0 512 0s512 229.222 512 512-229.222 512-512 512z m259.149-568.883h-290.74a25.293 25.293 0 0 0-25.292 25.293l-0.026 63.206c0 13.952 11.315 25.293 25.267 25.293h177.024c13.978 0 25.293 11.315 25.293 25.267v12.646a75.853 75.853 0 0 1-75.853 75.853h-240.23a25.293 25.293 0 0 1-25.267-25.293V417.203a75.853 75.853 0 0 1 75.827-75.853h353.946a25.293 25.293 0 0 0 25.267-25.292l0.077-63.207a25.293 25.293 0 0 0-25.268-25.293H417.152a189.62 189.62 0 0 0-189.62 189.645V771.15c0 13.977 11.316 25.293 25.294 25.293h372.94a170.65 170.65 0 0 0 170.65-170.65V480.384a25.293 25.293 0 0 0-25.293-25.267z"
                    fill="hsl(250deg 69% 61%)"
                    p-id="2758"
                  ></path>
                </svg>
              </a>
              <a
                href="https://github.com/LanAnTree"
                target="_blank"
                class="home__social-icon"
              >
                <i class="uil uil-github-alt"></i>
              </a>
              <a
                href="https://blog.csdn.net/qq_44833552"
                target="_blank"
                class="home__social-icon"
              >
                <!-- <i class="uil uil-dribbble"></i> -->
                <svg 
                  t="1681996741934" 
                  class="icon" 
                  viewBox="0 0 1024 1024" 
                  version="1.1" 
                  xmlns="http://www.w3.org/2000/svg" 
                  p-id="4124"
                  with="200px"
                  hight="200px"
                >
                  <path 
                    d="M512 90.125c233.00683594 0 421.875 188.86816406 421.875 421.875s-188.86816406 421.875-421.875 421.875S90.125 745.00683594 90.125 512 278.99316406 90.125 512 90.125z m156.515625 619.62890625l9.22851563-89.17382813c-26.28808594 7.85742188-83.16210938 13.2890625-121.7109375 13.28906251-110.79492188 0-169.51464844-38.97070313-160.94531251-120.55078126 9.54492188-91.20410156 93.234375-120.04980469 191.68945313-120.04980468 45.140625 0 100.88085938 7.25097656 124.6640625 15.10839843L722.9375 314.82617187C687.13085938 306.20410156 649.00390625 301.0625 584.16699219 301.0625c-167.43164063 0-320.28222656 78.17871094-334.86328125 217.10742188C237.06933594 634.73925781 340.27050781 722.9375 531.45898438 722.9375c66.47167969 0 114.09082031-5.29980469 137.05664062-13.18359375z" 
                    fill="hsl(250deg 69% 61%)"
                     p-id="4125"></path>
                </svg>
              </a>
            </div>

            <div class="home__img">
              <svg
                class="home__blob"
                viewBox="0 0 200 187"
                xmlns="http://www.w3.org/2000/svg"
                xmlns:xlink="http://www.w3.org/1999/xlink"
              >
                <mask id="mask0" mask-type="alpha">
                  <path
                    d="M190.312 36.4879C206.582 62.1187 201.309 102.826 182.328 134.186C163.346 165.547 
                                130.807 187.559 100.226 186.353C69.6454 185.297 41.0228 161.023 21.7403 129.362C2.45775 
                                97.8511 -7.48481 59.1033 6.67581 34.5279C20.9871 10.1032 59.7028 -0.149132 97.9666 
                                0.00163737C136.23 0.303176 174.193 10.857 190.312 36.4879Z"
                  />
                </mask>
                <g mask="url(#mask0)">
                  <path
                    d="M190.312 36.4879C206.582 62.1187 201.309 102.826 182.328 134.186C163.346 
                                165.547 130.807 187.559 100.226 186.353C69.6454 185.297 41.0228 161.023 21.7403 
                                129.362C2.45775 97.8511 -7.48481 59.1033 6.67581 34.5279C20.9871 10.1032 59.7028 
                                -0.149132 97.9666 0.00163737C136.23 0.303176 174.193 10.857 190.312 36.4879Z"
                  />
                  <image
                    class="home__blob-img"
                    x="0"
                    y="-30"
                    xlink:href="assets/img/cat.png"
                  />
                </g>
              </svg>
            </div>

            <div class="home__data">
              <h1 class="home__title" i18n="home__title">
                持续学习
              </h1>
              <h3 class="home__subtitle" i18n="home__subtitle">
                JAVA工程师
              </h3>
              <p class="home__description" i18n="home__description">
                热爱学习，热爱生活，追求创新，探索新技术，崇尚Geek精神 <br />Striving for dreams, obsessed for technology
              </p>
              <a href="#contact" class="button button-flex">
                <span i18n="home__contact">与我联系</span>
                <i class="uil uil-message button__icon"></i>
              </a>
            </div>
          </div>
          <div class="home__scroll">
            <a href="#about" class="home__scroll-button button--flex">
              <i class="uil uil-mouse-alt-2 home__scroll-mouse"></i>
              <span class="home__scroll-name" i18n="home__scroll-name"
                >往下滑</span
              >
              <i class="uil uil-arrow-down home__scroll-arrow"></i>
            </a>
          </div>
        </div>
      </section>

      <!--==================== ABOUT ====================-->
      <section class="about section" id="about">
        <h2 class="section__title" i18n="about__title">关于我</h2>
        <span class="section__subtitle" i18n="about__subtitle"
          >简单介绍</span
        >
        <div class="about__container container grid">
          <!-- <img src="assets/img/about.png" alt="" class="about__img" /> -->
          <div class="home_model">
            <canvas class="webgl"></canvas>
          </div>

          <div class="about__data">
            <p class="about__description" i18n="about__description">
            </p>

            <div class="about__info">
              <div>
                <span class="about__info-title">1.0+</span>
                <span class="about__info-name" i18n="about__info-name1"
                  >年工作 <br />
                  经验</span
                >
              </div>

              <div>
                <span class="about__info-title">4+</span>
                <span class="about__info-name" i18n="about__info-name2"
                  >完整 <br />
                  项目</span
                >
              </div>

              <div>
                <span class="about__info-title">1 +</span>
                <span class="about__info-name" i18n="about__info-name3"
                  >公司 <br />
                  任职</span
                >
              </div>
            </div>
		
		<!-- href放入自己的pdf -->
            <div class="about__buttons">
              <a
                download="filename.pdf"
                href="####"
                class="button button--flex"
              >
                <span i18n="download">下载简历</span
                ><i class="uil uil-download-alt button__icon"></i>
              </a>
            </div>
          </div>
        </div>
      </section>

      <!--==================== SKILLS ====================-->
      <section class="skills section" id="skills">
        <h2 class="section__title" i18n="skills__title">技能</h2>
        <span class="section__subtitle" i18n="skills__subtitle"
          >技术水平</span
        >

        <div class="skills__container container grid">
          <div>
            <!--==================== SKILLS 1 ====================-->
            <div class="skills__content skills__open">
              <div class="skills__header">
                <i class="uil uil-brackets-curly skills__icon"></i>

                <div>
                  <h1 class="skills__title" i18n="skills__subtitle">
                    前端开发
                  </h1>
                  <span class="skills__subtitle" i18n="skills__years"
                    >1 年开发经验，1 年学习期</span
                  >
                </div>

                <i class="uil uil-angle-down skills__arrow"></i>
              </div>

              <div class="skills__list grid">
                <div class="skills__data">
                  <div class="skills__titles">
                    <h3 class="skills__name">HTML</h3>
                    <span class="skills__number">60%</span>
                  </div>
                  <div class="skills__bar">
                    <div class="skills__percentage skills__html"></div>
                  </div>
                </div>

                <div class="skills__data">
                  <div class="skills__titles">
                    <h3 class="skills__name">CSS</h3>
                    <span class="skills__number">50%</span>
                  </div>
                  <div class="skills__bar">
                    <div class="skills__percentage skills__css"></div>
                  </div>
                </div>

                <div class="skills__data">
                  <div class="skills__titles">
                    <h3 class="skills__name">JavaScript</h3>
                    <span class="skills__number">40%</span>
                  </div>
                  <div class="skills__bar">
                    <div class="skills__percentage skills__js"></div>
                  </div>
                </div>

                <div class="skills__data">
                  <div class="skills__titles">
                    <h3 class="skills__name">Node.js</h3>
                    <span class="skills__number">60%</span>
                  </div>
                  <div class="skills__bar">
                    <div class="skills__percentage skills__css"></div>
                  </div>
                </div>

                <div class="skills__data">
                  <div class="skills__titles">
                    <h3 class="skills__name">VUE</h3>
                    <span class="skills__number">40%</span>
                  </div>
                  <div class="skills__bar">
                    <div class="skills__percentage skills__js"></div>
                  </div>
                </div>

                <div class="skills__data">
                  <div class="skills__titles">
                    <h3 class="skills__name">Layui & Element-UI</h3>
                    <span class="skills__number">30%</span>
                  </div>
                  <div class="skills__bar">
                    <div class="skills__percentage skills__css"></div>
                  </div>
                </div>
              </div>
            </div>
            <!--==================== SKILLS 2 ====================-->
            <div class="skills__content skills__close">
              <div class="skills__header">
                <i class="uil uil-server-network skills__icon"></i>

                <div>
                  <h1 class="skills__title" i18n="skills__title2">
                    Java后端开发
                  </h1>
                  <span class="skills__subtitle" i18n="skills__years2"
                    > 1 年开发经验，4 年学习期</span
                  >
                </div>

                <i class="uil uil-angle-down skills__arrow"></i>
              </div>

              <div class="skills__list grid">
                <div class="skills__data">
                  <div class="skills__titles">
                    <h3 class="skills__name">Java</h3>
                    <span class="skills__number">80%</span>
                  </div>
                  <div class="skills__bar">
                    <div class="skills__percentage skills__java"></div>
                  </div>
                </div>

                <div class="skills__data">
                  <div class="skills__titles">
                    <h3 class="skills__name">Spring & SpringMvc & Mybatis & SpringBoot & Mybatis-Plus</h3>
                    <span class="skills__number">80%</span>
                  </div>
                  <div class="skills__bar">
                    <div class="skills__percentage skills__python"></div>
                  </div>
                </div>

                <div class="skills__data">
                  <div class="skills__titles">
                    <h3 class="skills__name">MySQL & Oracle</h3>
                    <span class="skills__number">75%</span>
                  </div>
                  <div class="skills__bar">
                    <div class="skills__percentage skills__js"></div>
                  </div>
                </div>

                <div class="skills__data">
                  <div class="skills__titles">
                    <h3 class="skills__name">RPC框架（SpringCloud alibaba）</h3>
                    <span class="skills__number">60%</span>
                  </div>
                  <div class="skills__bar">
                    <div class="skills__percentage skills__js"></div>
                  </div>
                </div>

                <div class="skills__data">
                  <div class="skills__titles">
                    <h3 class="skills__name">分布式事务 & 分布式ID & 分布式搜索引擎</h3>
                    <span class="skills__number">60%</span>
                  </div>
                  <div class="skills__bar">
                    <div class="skills__percentage skills__js"></div>
                  </div>
                </div>

                <div class="skills__data">
                  <div class="skills__titles">
                    <h3 class="skills__name">Redis</h3>
                    <span class="skills__number">65%</span>
                  </div>
                  <div class="skills__bar">
                    <div class="skills__percentage skills__js"></div>
                  </div>
                </div>

                <div class="skills__data">
                  <div class="skills__titles">
                    <h3 class="skills__name">RabbitMQ & Kafka</h3>
                    <span class="skills__number">55%</span>
                  </div>
                  <div class="skills__bar">
                    <div class="skills__percentage skills__js"></div>
                  </div>
                </div>

                <div class="skills__data">
                  <div class="skills__titles">
                    <h3 class="skills__name">UML & BPMN</h3>
                    <span class="skills__number">50%</span>
                  </div>
                  <div class="skills__bar">
                    <div class="skills__percentage skills__js"></div>
                  </div>
                </div>

                <div class="skills__data">
                  <div class="skills__titles">
                    <h3 class="skills__name">更多技能点……</h3>
                    <span class="skills__number">简历更全面、更详细哦</span>
                  </div>
                  <div class="skills__bar">
                    <div class="skills__percentage skills__js"></div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </section>

      <!--==================== QUALIFICATION ====================-->
      <section class="qualification section">
        <h2 class="section__title" i18n="qualification__title">
          经历
        </h2>
        <span class="section__subtitle" i18n="qualification__subtitle"
          >个人履历</span
        >
        <div class="qualification__container container">
          <div class="qualification__tabs">
            <div
              class="qualification__button button--flex qualification__active"
              data-target="#education"
            >
              <i class="uil uil-graduation-cap qualification__icon"></i>
              <span i18n="education">教育</span>
            </div>

            <div class="qualification__button button--flex" data-target="#work">
              <i class="uil uil-briefcase-alt qualification__icon"></i>
              <span i18n="work">工作</span>
            </div>
          </div>
          <div class="qualification__sections">
            <!--==================== QUALIFICATION CONTENT 1 ====================-->
            <div
              class="qualification__content qualification__active"
              data-content
              id="education"
            >
              <!--==================== QUALIFICATION 1 ====================-->
              <div class="qualification__data">
                <div>
                  <h3 class="qualification__title" i18n="qualification1__title">
                    软件工程
                  </h3>
                  <span
                    class="qualification__subtitle"
                    i18n="qualification1__subtitle"
                    >衡阳师范学院</span
                  >
                  <div class="qualification__calendar">
                    <i class="uil uil-calendar-alt"></i>
                    2018 - 2022
                  </div>
                </div>

                <div>
                  <span class="qualification__rounder"></span>
                  <span class="qualification__line"></span>
                </div>
              </div>
              <!--==================== QUALIFICATION 2 ====================-->
              <div class="qualification__data">
                <div></div>
                <div>
                  <span class="qualification__rounder"></span>
                  <span class="qualification__line"></span>
                </div>

                <div>
                  <h3 class="qualification__title" i18n="qualification2__title">
                    前端技术学习
                  </h3>
                  <span
                    class="qualification__subtitle"
                    i18n="qualification2__subtitle"
                    >BiliBili大学</span
                  >
                  <div class="qualification__calendar">
                    <i class="uil uil-calendar-alt"></i>
                    2019.01-2019.09
                  </div>
                </div>
              </div>
              <!--==================== QUALIFICATION 3 ====================-->
              <div class="qualification__data">
                <div>
                  <h3 class="qualification__title" i18n="qualification3__title">
                    后端技术学习
                  </h3>
                  <span
                    class="qualification__subtitle"
                    i18n="qualification3__subtitle"
                    >BiliBili大学</span
                  >
                  <div class="qualification__calendar">
                    <i class="uil uil-calendar-alt"></i>
                    2019.09 - 至今
                  </div>
                </div>

                <div>
                  <span class="qualification__rounder"></span>
                  <!-- <span class="qualification__line"></span> -->
                </div>
              </div>
            </div>
            <!--==================== QUALIFICATION CONTENT 2 ====================-->
            <div class="qualification__content" data-content id="work">
              <!--==================== QUALIFICATION 1 ====================-->
              <div class="qualification__data">
                <div>
                  <h3 class="qualification__title" i18n="qualification4__title0">
                    工作
                  </h3>
                  <span
                    class="qualification__subtitle"
                    i18n="qualification4__subtitle0"
                    >北京</span
                  >
                  <div class="qualification__calendar">
                    <i class="uil uil-calendar-alt"></i>
                    2021 - 2023
                  </div>
                </div>

                <div>
                  <span class="qualification__rounder"></span>
                  <span class="qualification__line"></span>
                </div>
              </div>
              <div class="qualification__data">
                <div></div>
                <div>
                  <span class="qualification__rounder"></span>
                  <!-- <span class="qualification__line"></span> -->
                </div>
                <div>
                  <h3 class="qualification__title" i18n="qualification4__title">
                    求职
                  </h3>
                  <span
                    class="qualification__subtitle"
                    i18n="qualification4__subtitle"
                    >深圳 & 广州</span
                  >
                  <div class="qualification__calendar">
                    <i class="uil uil-calendar-alt"></i>
                    2023
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </section>

      <!--==================== PORTFOLIO ====================-->
      <section class="portfolio section" id="portfolio">
        <h2 class="section__title" i18n="portfolio__title">项目集</h2>
        <span class="section__subtitle" i18n="portfolio__subtitle"
          >最新作品</span
        >

        <div class="portfolio__container container swiper-container">
          <div class="swiper-wrapper">
            <!--==================== PORTFOLIO 1 ====================-->

            <div class="portfolio__content grid swiper-slide">
              <img
                src="assets/img/portfolio1.jpg"
                alt=""
                class="portfolio__img"
              />

              <div class="portfolio_">
                <h3 class="portfolio__title" i18n="portfolio1__title">
                  mjz_oa
                </h3>
                <p
                  class="portfolio__description"
                  i18n="portfolio1__description"
                >
                集成Activiti的自动办公系统，整合form-create使得审批模板表单生成更加简单
                </p>
                <a
                  href="https://github.com/LanAnTree"
                  target="_blank"
                  class="button button--flex button--small portfolio__button"
                >
                  Demo
                  <i class="uil uil-arrow-right button__icon"></i>
                </a>
              </div>
            </div>

            <!--==================== PORTFOLIO 2 ====================-->

            <div class="portfolio__content grid swiper-slide">
              <img
                src="assets/img/portfolio2.jpg"
                alt=""
                class="portfolio__img"
              />

              <div class="portfolio_">
                <h3 class="portfolio__title" i18n="portfolio2__title">
                  MExchange
                </h3>
                <p
                  class="portfolio__description"
                  i18n="portfolio2__description"
                >
                一款交易平台(完善后会转为联盟营销站点)，RPC框架使用的SpringCloud alibaba那套，项目属于精做，一直在打磨。
                <br>
                eg：大数据量的过滤字符，可能会使用AC、DFA，但系统采用了对内存极致压缩的FST
                </p>
                <a
                  href="https://gitee.com/prboy/dak-servers.gitee.io"
                  target="_blank"
                  class="button button--flex button--small portfolio__button"
                >
                  Demo
                  <i class="uil uil-arrow-right button__icon"></i>
                </a>
              </div>
            </div>

            <!--==================== PORTFOLIO 3 ====================-->

            <div class="portfolio__content grid swiper-slide">
              <img
                src="assets/img/portfolio3.jpg"
                alt=""
                class="portfolio__img"
              />

              <div class="portfolio_">
                <h3 class="portfolio__title" i18n="portfolio3__title">
                  mjz_RPC
                </h3>
                <p
                  class="portfolio__description"
                  i18n="portfolio3__description"
                >
                一款分布式服务框架，提供稳定高性能的RPC远程服务调用功能。拥有'高性能、分布式、注册中心、负载均衡、服务治理'等特性，拥有独特的心跳检测机制，还有一套可视化界面
                </p>
                <!-- 完善中
                  target="_blank"-->
                <a
                  href="####"
                  class="button button--flex button--small portfolio__button"
                >
                  Demo
                  <i class="uil uil-arrow-right button__icon"></i>
                </a>
              </div>
            </div>
          </div>
          <!-- add arrows-->
          <div class="swiper-button-next">
            <i class="uil uil-angle-right-b swiper-portfolio-icon"></i>
          </div>

          <div class="swiper-button-prev">
            <i class="uil uil-angle-left-b swiper-portfolio-icon"></i>
          </div>

          <!-- Add Pagination -->
          <div class="swiper-pagination"></div>
        </div>
      </section>

      <!--==================== CONTACT ME ====================-->
      <section class="contact section" id="contact">
        <h2 class="section__title" i18n="contact__title">联系我</h2>
        <span class="section__subtitle" i18n="contact__subtitle"
          >与我取得联系</span
        >

        <div class="contact__container container grid">
          <div>
            <div class="contact__information">
              <i class="uil uil-phone-alt contact__icon"></i>

              <div>
                <h3 class="contact__title" i18n="tel">电话号码</h3>
                <span class="contact__subtitle" i18n="tel__number"
                  >18373018106</span
                >
              </div>
            </div>

            <div class="contact__information">
              <i class="uil uil-envelope contact__icon"></i>

              <div>
                <h3 class="contact__title" i18n="email">电子邮箱</h3>
                <span class="contatc__subtitle" i18n="email__address"
                  >2509763868@qq.com</span
                >
              </div>
            </div>

            <div class="contact__information">
              <i class="uil uil-map-marker contact__icon"></i>

              <div>
                <h3 class="contact__title" i18n="location">位置</h3>
                <span class="contatc__subtitle" i18n="location__detail"
                  >湖南 , 中国</span
                >
              </div>
            </div>
          </div>
        </div>
      </section>
    </main>

    <!--==================== FOOTER ====================-->
    <footer class="footer">
      <div class="footer__bg">
        <div class="footer__container container grid">
          <div>
            <h1 class="footer__title">LanAn</h1>
            <span class="footer__subtitle" i18n="home__subtitle"
              >JAVA工程师</span
            >
          </div>

          <ul class="footer__links">
            <li>
              <a href="#skills" class="footer__link" i18n="skills">技能</a>
            </li>
            <li>
              <a href="#portfolio" class="footer__link" i18n="portfolio"
                >项目集</a
              >
            </li>
            <li>
              <a href="#contact" class="footer__link" i18n="contact">联系</a>
            </li>
          </ul>

          <div class="footer__socials">
            <a href="https://gitee.com/mao_jin_zhi" target="_blank">
              <svg class="icon footer__social" aria-hidden="true">
                <use xlink:href="#icon-gitee"></use>
              </svg>
            </a>
            <a href="https://github.com/LanAnTree" target="_blank">
              <svg class="icon footer__social" aria-hidden="true">
                <use xlink:href="#icon-github"></use>
              </svg>
            </a>
            <a href="https://blog.csdn.net/qq_44833552" target="_blank">
              <svg class="icon footer__social" aria-hidden="true">
                <use xlink:href="#icon-csdn"></use>
              </svg>
            </a>
          </div>
        </div>

        <p class="footer__copy">
          &#169; LanAn.Copy from
          <a
            class="footer__copy"
            href="https://www.youtube.com/c/Bedimcode"
            target="_blank"
            >Bedimcode</a
          >
        </p>
      </div>
    </footer>

    <!--==================== SCROLL TOP ====================-->
    <a href="#" class="scrollup" id="scroll-up">
      <i class="uil uil-arrow-up scrollup__icon"></i>
    </a>
    <!--==================== SWIPER JS ====================-->
    <script src="assets/js/default/swiper-bundle.min.js"></script>

    <!-- iconfont JS -->
    <script src="assets/js/default/iconfont.js"></script>
    <!-- jquery -->
    <script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
    <script src="assets/js/default/jquery.i18n.min.js"></script>
    <!--==================== MAIN JS ====================-->
    <script src="assets/js/default/main.js"></script>

    <!-- translate JS -->
    <script src="assets/js/default/cn-en-translate.js"></script>

    <!-- gsap JS -->
    <script src="https://cdn.bootcdn.net/ajax/libs/gsap/3.11.5/gsap.min.js"></script>

    <!-- module模块化 -->
    <script type="importmap">
          {
              "imports":{
                  "three":"./assets/js/three/build/three.module.js",
                  "three/examples/jsm/":"./assets/js/three/jsm/"
              }
          }
    </script>

    <!-- MyRoom JS -->
    <script type="module" src="./assets/js/change/room.js"></script>
  </body>
</html>
